<template>
  <div class="shop" v-loading="loading">
    <el-form :model="form" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
      <el-form-item label="门店名称:" prop="name">
        <el-input style="width:60%" v-model="form.name" :disabled="isputEdit"></el-input>
      </el-form-item>
      <el-form-item label="联系人:" prop="consignee">
        <el-input style="width:60%" v-model="form.consignee" :disabled="isputEdit"></el-input>
      </el-form-item>
      <el-form-item label="联系电话" prop="contactPhone" type="number">
        <el-input style="width:30%" v-model="form.contactPhone" :disabled="isputEdit"></el-input>
      </el-form-item>
      <!-- <el-form-item label ='账号' prop='account'>
              <el-input  style ='width:30%;' v-model="form.account" @input ="changeAccount"></el-input>
              <el-button class='accountBtn' v-if='!resId' @click="editAccount">检测</el-button>
              <p class ='account_desc' v-if='successAccount'><i class="el-icon-circle-check"></i>用户账号检测成功</p>
              <p class ='account_desc_failure' v-if='failureAcccount'><i class="el-icon-circle-check"></i>用户账号检测失败</p>
      </el-form-item>-->

      <el-form-item label="用户账号" prop="memberMobile">
        <el-col :span="6">
          <el-input v-model="form.memberMobile" @input="changeAccount"
            :disabled="type == 2 && isWatchOrEdit == false"></el-input>
        </el-col>
        <el-col :span="2" align="center">
          <span>用户ID</span>
        </el-col>
        <el-col :span="3">
          <el-input v-model="form.memberId" @input="changeUid" :disabled="isputEdit"></el-input>
        </el-col>
        <el-col :span="2">
          <el-button class="accountBtn" v-if="!resId" @click="editAccount" :disabled="isputEdit">检测</el-button>
        </el-col>
        <el-col>
          <p>账号/ID二选一</p>
        </el-col>
        <p class="account_desc" v-if="successAccount">
          <i class="el-icon-circle-check"></i>用户账号检测成功
        </p>
        <p class="account_desc_failure" v-if="failureAcccount">
          <i class="el-icon-circle-check"></i>用户账号检测失败
        </p>
      </el-form-item>

      <!-- <el-form-item label='所属区域：'
                      prop='region_id'>
                      <el-select style="width:140px;"
                    size='mini'
                    v-model="form.region.province_id"
                    filterable
                    :disabled="isputEdit"
                    @change="onChangeProvinceAdd"
                    class="select"
                    placeholder="省份">
                    <el-option v-for="item in provinceList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"></el-option>
      </el-select>-->

      <!-- <el-select style="width:140px;margin-left:12px;"
                  size='mini'
                  v-model="form.region.city_id"
                  filterable
                  :disabled="isputEdit"
                  @change="onChangeCityAdd"
                  class="select"
                  placeholder="市">
             <el-option v-for="item in cityList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"></el-option>
      </el-select>-->
      <!-- <el-select style="width:140px;margin-left:12px;"
                  size='mini'
                  :disabled="isputEdit"
                  v-model="form.region.area_id"
                  @change="onChangeDownAdd"
                  filterable
                  class="select"
                  placeholder="区/县">

            <el-option v-for="item in townAreaList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"></el-option>
      </el-select>-->

      <!-- <el-select style="width:140px;margin-left:12px;"
                 size='mini'
                 :disabled="isputEdit"
                 v-model="form.region.town_id"
                 filterable
                 class="select"
                 @change="onChangeStreet"
                 placeholder="乡镇/街道">

           <el-option v-for="item in streetList"
                   :key="item.id"
                   :label="item.name"
                   :value="item.id"></el-option>
      </el-select>-->
      <!-- <br /> -->
      <!--
                        <el-select style="width:140px;margin-left:12px;"
                          v-model="form.region_id"
                          size="mini"
                          filterable
                          :disabled="isputEdit"
                          placeholder="选择社区">
                          <el-option v-for="item in streetAreaList"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id"></el-option>
                        </el-select>
      </el-form-item>-->

      <el-form-item label="小店地址" prop="address">
        <el-input style="width:30%;" v-model="form.address" :disabled="isputEdit"></el-input>
        <el-button class="accountBtn" @click="refreshLocation" :disabled="isputEdit">重置</el-button>
        <p class="account_location" v-if="form.address"></p>
      </el-form-item>

      <!--v-if="(!resId && type == 2) || type == 1 "-->
      <el-form-item label="邀请合伙人" prop="partnerName">
        <el-input style="width:30%;" v-model="form.partnerName" @input="changePreAccount"
          :disabled="type == 2 && isWatchOrEdit2 == false && form.invitation_mobile != ''"></el-input>

        <span style="color:red;margin-left:12px;margin-right:4px;">*</span>
        <span style="margin-right:12px;">服务经理</span>
        <el-input style="width:30%;" v-model="form.serviceManagerName"
          :disabled="type == 2 && isWatchOrEdit2 == false"></el-input>

        <!-- <el-button class='accountBtn' v-if='!resId'  @click="editPreAccount" :disabled="isputEdit">检测</el-button>
                <p class ='account_desc' v-if='presuccessAccount'><i class="el-icon-circle-check"></i>账号检测成功</p>
        <p class ='account_desc_failure' v-if='prefailureAcccount'><i class="el-icon-circle-check"></i>账号检测失败</p>-->
      </el-form-item>

      <div class="line"></div>

      <el-row class="picCol">
        <!--营业执照-->
        <el-col :span="12">
          <el-form-item label="营业执照:" prop="licensePicture">
            <img :src="form.licensePicture" class="img" v-if="form.licensePicture" width="200" height="100" />
            <!-- <uploadImg
              flieName="licence_img"
              class="icon_cate"
              :disabled="isputEdit"
              :oldImgs="[form.licence_img]"
              :n="1"
              @getFile="getFile"
            ></uploadImg> -->
            <!-- <p class="note">支持上传png,jpg,gif格式的图片,不大于500kb</p>
            <p class="note">建议图片尺寸：600*480px</p> -->
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="店主身份照:">
            <img :src="form.idPicture.split(',')[0]" class="img" v-if="form.idPicture" width="200" height="100" />
            <img :src="form.idPicture.split(',')[1]" class="img" v-if="form.idPicture" width="200" height="100" />
            <!-- <uploadImg
              flieName="identity_img"
              class="icon_cate"
              :disabled="isputEdit"
              :oldImgs="[form.identity_img]"
              :n="1"
              @getFile="getFile"
            ></uploadImg> -->
            <!-- <p class="note">支持上传png,jpg,gif格式的图片,不大于500kb</p>
            <p class="note">建议图片尺寸：600*480px</p> -->
          </el-form-item>
        </el-col>
      </el-row>
      <el-row class="picCol">
        <el-col :span="12">
          <el-form-item label="商户门头照:">
            <!-- @click="viewPic(form.picture)"  -->
            <img :src="form.image" class="img" v-if="form.image" width="200" height="100" />
            <!-- <uploadImg
              flieName="facade_img"
              class="icon_cate"
              :disabled="isputEdit"
              :oldImgs="[form.facade_img]"
              :n="1"
              @getFile="getFile"
            ></uploadImg>
            <p class="note">支持上传png,jpg,gif格式的图片,不大于500kb</p>
            <p class="note">建议图片尺寸：600*480px</p> -->
          </el-form-item>
        </el-col>
      </el-row>

      <div class="line"></div>

      <!--合同照 加盟费-->
      <!-- <el-form-item label="合同照:" class="picCol"> -->
      <!-- licensePicture -->
      <!-- <img :src="form.licensePicture" class="img" v-if="form.licensePicture" width="200" height="100"/> -->
      <!-- <uploadImg
          flieName="contract_img"
          class="icon_cate"
          :oldImgs="[form.contract_img]"
          :n="1"
          :disabled="isputEdit"
          @getFile="getFile"
        ></uploadImg>
        <p class="note">支持上传png,jpg,gif格式的图片,不大于500kb</p>
        <p class="note">建议图片尺寸：600*480px</p> -->
      <!-- </el-form-item> -->
      <el-row>
        <el-row style="margin:12px;">
          <!-- <el-form-item label='加盟费:'> -->
          <span style="color:#666;margin-left:28px;margin-right:12px;">加盟费:</span>
          <el-input type="number" style="width:160px" :disabled="isputEdit" min="0"
            v-model="form.initial_money"></el-input>
          <!-- <el-input type='number' style="width:100px" v-model='form.actual_money'></el-input> --
          <el-input type='number' style="width:100px" v-model='form.wait_money'></el-input>-->
          <!-- </el-form-item> -->
          <!-- <el-form-item label='转账方式:'> -->
          <span style="color:#666;margin-left:100px;margin-right:12px;">转账方式:</span>
          <el-select style="width:100px;" size="small" v-model="form.transfer_way" filterable :disabled="isputEdit"
            class="select" placeholder="请选择">
            <el-option v-for="item in paywayList" :key="item.id" :label="item.name" :value="item.id"></el-option>
          </el-select>
          <el-input type="text" v-model="form.transfer_name" class="paywayinput" :disabled="isputEdit" size="small"
            clearable></el-input>
          <!-- </el-form-item> -->
        </el-row>

        <!-- <el-col :span='12'> -->

        <!-- </el-col> -->

        <el-form-item label="缴费类型:" v-if="resId">
          <span v-if="form.vip_shop_pay_type == 1" style="color:#666;font-size:13px;">全额缴费入驻</span>
          <span v-if="form.vip_shop_pay_type == 2" style="color:#666;font-size:13px;">押金缴费入驻</span>
          <span v-if="form.vip_shop_pay_type == 0" style="color:#666;font-size:13px;">无</span>

          <el-button size="mini" style="margin-left:12px;" @click="lookZhifuOrder">查看支付订单</el-button>

          <el-button size="mini" v-if="form.vip_shop_pay_type == 1 && type == 2" style="margin-left:12px;"
            @click="pullFeeShop">续费</el-button>
          <el-button size="mini" v-if="form.vip_shop_pay_type == 0 && type == 2" style="margin-left:12px;"
            @click="growUpShop">升级小店</el-button>
          <el-button size="mini" v-if="form.vip_shop_pay_type == 2 && type == 2" style="margin-left:12px;"
            @click="growUpShop">升级小店</el-button>
        </el-form-item>

        <el-form-item label="缴费类型:" prop="vip_shop_pay_type" v-if="!resId">
          <el-select v-model="form.vip_shop_pay_type" style="width:160px;" size="small" placeholder="请选择缴费类型">
            <el-option label="全额缴费入驻" value="1"></el-option>
            <el-option label="押金缴费入驻" value="2"></el-option>
            <el-option label="未缴费" value="0"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="支付流水号:" prop="pay_trade_no" v-if="!resId">
          <el-input v-model="form.pay_trade_no" style="width:320px;"></el-input>
          <span style="color:#999;margin-left:12px;font-size:12px;">如已缴费，请输入对应的支付流水号</span>
        </el-form-item>
      </el-row>

      <div class="line"></div>
      <el-row class="picCol">
        <el-col :span="12">
          <el-form-item label="店铺面积:">
            <el-input style="width:200px;" type="number" v-model="form.shopArea" :disabled="isputEdit">
              <p class="note_back" slot="suffix">m²</p>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="店员人数:">
            <el-input style="width:200px;" type="number" v-model="form.shopClerks" :disabled="isputEdit">
              <p class="note_back" slot="suffix">人</p>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="服务时长:">
        <el-date-picker v-model="form.contractStart" :disabled="isputEdit" type="date" align="right"
          value-format="yyyy-MM-dd" unlink-panels placeholder="开始日期"></el-date-picker>
        <el-date-picker v-model="form.contractEnd" type="date" :disabled="isputEdit" align="right"
          value-format="yyyy-MM-dd" unlink-panels placeholder="结束日期"></el-date-picker>
        <p class="sub_note">不选则默认长期有效</p>
      </el-form-item>
      <!-- <el-form-item label="平台分佣比例：" prop="platformCommissionPercent">
            <el-input size="mini" class="w100" v-model="form.platformCommissionPercent" placeholder="">
              <p class="note_back" slot="suffix">%</p>
            </el-input>
          </el-form-item>
          <el-form-item label="合伙人分佣比例：" prop="partnerCommissionPercent">
            <el-input size="mini" class="w100" v-model="form.partnerCommissionPercent" placeholder="">
              <p class="note_back" slot="suffix">%</p>
            </el-input>
          </el-form-item> -->
      <el-row class="picCol">
        <el-col :span="12">
          <el-form-item label="平台分佣比例:">
            <el-input style="width:100px;" type="number" v-model="form.platformCommissionPercent" :disabled="isputEdit">
              <p class="note_back" slot="suffix">%</p>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="合伙人分佣比例:" label-width="200">
            <el-input style="width:100px;" type="number" v-model="form.partnerCommissionPercent" :disabled="isputEdit">
              <p class="note_back" slot="suffix">%</p>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="服务费扣点:">
        <el-input type="number" v-model="form.serviceRate" style="width:200px;">
          <p class="note_back" slot="suffix">%</p>
        </el-input>
        <p class="sub_note">该设置只对门店的扫码付款订单有效</p>
      </el-form-item>
      <!-- <el-form-item label="截止时间:">
          {{form.vip_shop_end_time  | formatDate }}
        </el-form-item> -->
      <!--<el-form-item prop="role_type"  label="小店类型:" v-if="!this.resId">-->
      <el-form-item prop="role_type" label="小店分类:">
        {{ form.shopTypeName }}
        <!-- <el-radio v-for="item in categoryList" :key="item.id" v-model="form.role_type" :label="item.id">{{item.title}}</el-radio> -->
        <!-- <el-radio v-model="form.role_type" :label="1">候鸟基地</el-radio> -->
        <!-- <el-radio v-model="form.role_type" :label="2">幕后街公社</el-radio> -->
      </el-form-item>
      <!-- <el-form-item label="小店分类:" prop="category">
        <el-select
          style="width:100px;"
          size="small"
          v-model="form.shopTypeId"
          filterable
          :disabled="isputEdit"
          class="select"
          placeholder="请选择"
        >
          <el-option v-for="item in statusList" :key="item.id" :label="item.title" :value="item.id"></el-option>
        </el-select>
        <p class="sub_note">该分类是幕后街平台分类，具体分类类目请参考小店分类菜单</p>
      </el-form-item> -->
      <!-- <el-form-item prop="is_company" label="是否企业:">
        <el-radio v-model="form.is_company" :label="0">否</el-radio>
        <el-radio v-model="form.is_company" :label="1">是</el-radio>
      </el-form-item> -->
      <div class="line"></div>
      <div>
        <el-form-item label="审核记录:" class="picCol" v-if="resId && activities.length > 0">
          <el-timeline>
            <el-timeline-item v-for="(activity, index) in activities" :key="index" :color="activity.color"
              :timestamp="activity.timestamp">{{ activity.content }}</el-timeline-item>
          </el-timeline>
        </el-form-item>
        <el-form-item label="审核意见:" v-if="resId && audit" class="examine">
          <el-input v-model="form.note" type="textarea" style="width:450px;" placeholder="请输入备注" class="text-audit">
            <!-- <p class="note_back" slot="suffix">个</p> -->
          </el-input>
          <el-radio v-model="form.status" label="2">审核通过</el-radio>
          <el-radio v-model="form.status" label="0">审核驳回</el-radio>
        </el-form-item>
      </div>
    </el-form>

    <div class="footer" v-if="!isWatchOrEdit">
      <el-button type="primary" @click="addShopResceInformation">确定</el-button>
      <el-button type="danager" @click="cancelInfo">取消</el-button>
    </div>

    <!--商家地址选择-->
    <jdialog title="商家地址选择" :visible.sync="isShowLocation" width="600px">
      <el-row class="address_row">
        <el-col :span="4">商家地址：</el-col>
        <el-col :span="20">
          <el-input v-model="form.address" id="tipinput" size="small" placeholder="请输入地址搜索"></el-input>
        </el-col>
      </el-row>
      <el-row class="address_row">
        <el-col :span="4">经度信息：</el-col>
        <el-col :span="20">
          <el-input v-model="form.longitude" size="small" :disabled="true" placeholder="地图上选择定位后自动返显"></el-input>
        </el-col>
      </el-row>
      <el-row class="address_row">
        <el-col :span="4">纬度信息：</el-col>
        <el-col :span="20">
          <el-input v-model="form.latitude" size="small" :disabled="true" placeholder="地图上选择定位后自动返显"></el-input>
        </el-col>
      </el-row>
      <div id="container"></div>
    </jdialog>

    <jdialog title="支付记录" :visible.sync="isorderRecord" width="720px">
      <el-table :data="orderRecData" style="width:96%; margin:20px 12px;" max-height="680" :cell-style="tc"
        :header-cell-style="tccolor">
        <el-table-column label="订单编号" prop="order_no"></el-table-column>
        <el-table-column label="支付流水号" prop="out_order_no"></el-table-column>
        <el-table-column label="付款金额">
          <template slot-scope="scope">¥ {{ scope.row.actual_amount }}</template>
        </el-table-column>
        <el-table-column label="创建时间" prop="created_at"></el-table-column>
      </el-table>
    </jdialog>

    <jdialog title="小店升级确认" :visible.sync="isGrowUpShop" width="540px;">
      <el-form :model="growupForm" :rules="growrules" ref="growupForm" label-width="140px">
        <el-form-item label="升级小店类型:" prop="pay_type">
          <el-radio-group v-model="growupForm.pay_type">
            <el-radio label="2" :disabled="growupForm.pay_type == 2">押金入驻</el-radio>
            <el-radio label="1">全额缴费入驻</el-radio>
          </el-radio-group>
          <p style="color:#999;font-size:13px;">押金入驻小店仅非会员店可升级该类型</p>
        </el-form-item>

        <el-form-item label="加盟费:" prop="service_money">
          <el-input v-model="growupForm.service_money" style="width:240px;">
            <p class="note_back" slot="suffix">元</p>
          </el-input>

          <p style="color:#999;font-size:13px;">加盟费跟入驻费分佣相关，请仔细核实</p>
        </el-form-item>

        <el-form-item label="支付流水号:" prop="pay_trade_no">
          <el-input v-model="growupForm.pay_trade_no" style="width:240px;"></el-input>
        </el-form-item>
      </el-form>

      <div style="text-align:center;margin:20px 0;">
        <el-button size="mini" @click="isGrowUpShop = false">取消</el-button>
        <el-button size="mini" type="primary" @click="certainGrowupShop">确定</el-button>
      </div>
    </jdialog>

    <!--小店续费确认-->
    <jdialog title="小店续费确认" :visible.sync="isRenewShop" width="540px;">
      <el-form :model="renewForm" :rules="renewRules" ref="renewForm" label-width="140px" style="margin-top:20px;">
        <el-form-item label="续费金额:" prop="service_money">
          <el-input v-model="renewForm.service_money" style="width:240px;">
            <p class="note_back" slot="suffix">元</p>
          </el-input>

          <p style="color:#999;font-size:13px;">续费后按固定比例分成，请仔细确认金额</p>
          <p style="color:#999;font-size:13px;">续费成功后小店服务时长自动延长1年</p>
        </el-form-item>

        <el-form-item label="支付流水号:" prop="pay_trade_no">
          <el-input v-model="renewForm.pay_trade_no" style="width:240px;"></el-input>
        </el-form-item>
      </el-form>

      <div style="text-align:center;margin:20px 0;">
        <el-button size="mini" @click="isRenewShop = false">取消</el-button>
        <el-button size="mini" type="primary" @click="certainRenew">确定</el-button>
      </div>
    </jdialog>
  </div>
</template>


<script>
import AMap from "AMap";
// import {
//   shopEnterAuditDetailData,
//   shopCreateDetailData,
//   shopFansCheck,
//   shopPartnerCheck,
//   shopEnterManagerDetailData,
//   shopUpdateDetailData
// } from "@/api/shopdetail";
// import { shopTypeList, shopCategoryList } from "@/api/goods";
// import {
//   commonChilderRegionList,
//   shopServiceOrdersUidList,
//   shopUpGrade,
//   renewVipShopWithId
// } from "@/api/service";
// // var autoComplete = null
// import uploadImg from "@/components/uploadImg";
// residenceinformation
import { shopTypeListAll, shopCategoryList } from "@/api/store";
import {
  seller_list,
  seller_del,
  seller_check,
  seller_check2,
  seller_refuse,
  seller_recharge,
  seller_detail,
  sellerChecked
} from '@/api/seller';
export default {
  components: {
    // uploadImg
  },
  data() {
    return {
      loading: false,
      //账号检测
      successAccount: false,
      failureAcccount: false,
      uid: 0,

      //地理位置
      // location:'',
      // lng:'',
      // lat:'',
      isShowLocation: false,

      //上级账号
      presuccessAccount: false,
      prefailureAcccount: false,

      //判断是否查看还是编辑,
      isWatchOrEdit: true,
      isWatchOrEdit2: true,
      role_type: 0,
      paywayList: [
        { id: 1, name: "支付宝" },
        { id: 2, name: "银联" },
        { id: 0, name: "请选择" }
      ],
      statusList: [],
      resId: "",
      type: "",
      audit: "",
      form: {
        partnerCommissionPercent: 2,
        platformCommissionPercent: 10,
        note: '',
        actualCommission: 0,
        adCode: "",
        adcode: "",
        address: "",
        adname: null,
        agentPicture: "",
        bank: "",
        bankAccount: "",
        bankHost: "",
        businessArea: '',
        city: "",
        cityCode: '',
        codeUrl: '',
        company: "",
        consignee: "",
        contactAddress: "",
        contactEmail: "",
        contactPhone: "",
        contractEnd: "",
        contractStart: "",
        contracts: "",
        county: "",
        countyCode: '',
        createTime: '',
        createdAt: "",
        id: 0,
        idNumber: "",
        idPicture: "",
        image: '',
        isFront: 0,
        isVip: 0,
        joinUnion: '',
        lat: 32.072217,
        latitude: '',
        legalPerson: "",
        licensePicture: "",
        lng: 118.801541,
        longitude: '',
        memberId: 102,
        memberMobile: '',
        memberName: '',
        money: 0,
        name: "",
        opentimeToday: '',
        opentimeWeek: '',
        orderNum: 0,
        partnerName: "",
        pictUrl: null,
        picture: "",
        platform: '',
        poisId: '',
        province: "",
        provinceCode: '',
        rating: '',
        recommend: '',
        recommendV: '',
        regDate: "",
        registerCapital: 0,
        remark: "",
        scope: "",
        sellerType: "3",
        serviceManagerName: "",
        serviceRate: 1,
        shopArea: "111",
        shopClerks: "11",
        shopCode: "",
        shopNum: "",
        shopStyle: 0,
        shopTypeName: "",
        status: 2,
        statusText: "",
        tel: '',
        type: '',
        uid: '',
        updateTime: '',
        vipCycle: '',
        vipEndTime: "",
        vipPrice: '',
        role_type: "",
        service_rate: 0,
        shop_name: "",
        contact: "",
        phone: "",
        account: "",
        address: "",
        ad_code: "",
        longitude: "",
        latitude: "",
        invitation_mobile: "",
        invitation_operate_mobile: "",
        licence_img: "",
        identity_img: "",
        facade_img: "",
        contract_img: "",
        initial_money: "2980",
        actual_money: 0,
        wait_money: 0,
        transfer_name: "",
        transfer_way: "",
        shop_area: "",
        shop_clerks: "",
        service_time_start: "",
        service_time_end: "",
        audit_record: [],
        type_id: "",
        examine_status: 0,
        examine_content: "",
        region_id: "",
        region: {
          province_id: "",
          city_id: "",
          area_id: "",
          town_id: ""
        },
        //0 普通  1全额 2押金
        vip_shop_pay_type: "",
        pay_trade_no: "",
        uid: "",
        is_company: 0
      },

      provinceList: [],
      cityList: [],
      townAreaList: [],
      streetList: [],

      streetAreaList: [],

      activities: [],
      categoryList: [],
      //审核相关
      status: "",
      rules: {
        shop_name: [
          { required: true, message: "请输入门店名称", trigger: "blur" },
          { min: 1, max: 25, message: "长度在 1 到 25 个字符", trigger: "blur" }
        ],
        contact: [
          { required: true, message: "请输入联系人", trigger: "blur" },
          { min: 1, max: 15, message: "长度在 1 到 15 个字符", trigger: "blur" }
        ],
        phone: [{ required: true, message: "请输入联系电话", trigger: "blur" }],
        account: [{ required: true, message: "请输入账号", trigger: "blur" }],
        region_id: [
          { required: true, message: "请选择所属区域", trigger: "blur" }
        ],
        address: [
          { required: true, message: "请输入小店地址", trigger: "blur" }
        ],
        invitation_mobile: [
          { required: true, message: "请输入邀请合伙人", trigger: "blur" }
        ],
        licence_img: [
          { required: true, message: "请上传营业执照", trigger: "blur" }
        ],
        role_type: [
          { required: true, message: "请选择小店类型", trigger: "change" }
        ],
        category: [
          { required: true, message: "请选择小店分类", trigger: "blur" }
        ],
        vip_shop_pay_type: [
          { required: true, message: "请选择缴费类型", trigger: "change" }
        ]
      },
      //是否能编辑
      isputEdit: false,

      isorderRecord: false,
      orderRecData: [],

      //升级小店
      isGrowUpShop: false,
      growupForm: {
        pay_trade_no: "",
        service_money: "",
        pay_type: "",
        shopId: ""
      },
      growrules: {
        pay_type: [
          { required: true, message: "请选择升级小店类型", trigger: "change" }
        ],
        service_money: [
          { required: true, message: "请填写加盟金额", trigger: "blur" }
        ],
        pay_trade_no: [
          { required: true, message: "请填写支付流水号", trigger: "blur" }
        ]
      },

      //小店续费确认
      isRenewShop: false,
      renewForm: {
        pay_trade_no: "",
        service_money: "",
        shopId: ""
      },
      renewRules: {
        service_money: [
          { required: true, message: "请填写加盟金额", trigger: "blur" }
        ],
        pay_trade_no: [
          { required: true, message: "请填写支付流水号", trigger: "blur" }
        ]
      }
    };
  },

  mounted() {
    this.resId = this.$route.query.cid;
    this.type = this.$route.query.type;
    console.log(this.type);
    this.isWatchOrEdit = this.$route.query.isWatchOrEdit == 'true';
    // alert(this.isWatchOrEdit)

    this.audit = this.$route.query.audit == 'true';

    // this.getcommonChilderRegionList(1, 0);
    if (this.resId) {
      if (this.type == 1) {
        this.isputEdit = true;
        this.getshopEnterAuditDetailData();
      } else {
        this.isputEdit = false;
        this.getshopEnterManagerDetailData();
      }
    } else {
      this.loading = false;
    }
    this.getShopList();
    this.getShopCategoryList();
  },

  methods: {
    viewPic(row) {
      if (row.imgUrls) {
        let all_pic = row.imgUrls.split(",");
        $("#pic_viewer").html("");
        if (all_pic && all_pic.length > 0) {
          all_pic.forEach((item, idx) => {
            var str = '<li style="width:100%;">';
            str += '<img rel-src="' + item + '" src="' + item + '">';
            str += '</li>';
            $("#pic_viewer").append(str);
          })
        }
        this.viewerId && this.viewerId.destroy()
        this.viewerId = new Viewer(document.getElementById('pic_viewer'));
        $('#pic_viewer').find("img").eq(0).trigger("click")
      }
    },
    //检测账号
    editAccount() {
      if (!this.form.uid && !this.form.account) {
        this.$message.error("请输入用户账户或用户ID");
        return;
      }
      this.getshopFansCheckData();
    },
    async getshopFansCheckData() {
      let res = await shopFansCheck({
        uid: this.form.uid,
        account: this.form.account
      });
      if (res.code === 10000) {
        if (res.data.is_adopt == 0) {
          this.failureAcccount = true;
        } else {
          this.successAccount = true;
        }
      } else {
        this.$message.error(res.message);
      }
    },
    changeAccount() {
      this.form.uid = "";
      this.successAccount = false;
      this.failureAcccount = false;
    },
    changeUid() {
      this.form.account = "";
      this.successAccount = false;
      this.failureAcccount = false;
    },
    getFile(file) {
      console.log(file);
      this.form[file.name] = file.files.length > 0 ? file.files[0].url : "";
    },

    //地理位置
    refreshLocation() {
      const vatlo = this;
      this.isShowLocation = true;
      var map;
      if (this.resId && this.form.longitude && this.form.latitude) {
        map = new AMap.Map("container", {
          resizeEnable: true,
          center: [this.form.longitude, this.form.latitude]
        });
      } else {
        map = new AMap.Map("container", {
          resizeEnable: true
        });
      }
      var autoOptions = {
        input: "tipinput"
      };
      var auto = new AMap.Autocomplete(autoOptions);
      var placeSearch = new AMap.PlaceSearch({
        map: map
      }); //构造地点查询类
      // placeSearch.search(val, (status, result)=>{
      //   console.log(result)
      // });
      AMap.event.addListener(auto, "select", select); //注册监听
      function select(e) {
        placeSearch.setCity(e.poi.adcode);
        placeSearch.search(e.poi.name); //关键字查询查询
        console.log(e);
        //console.log(e.poi);
        vatlo.form.longitude = e.poi.location.lng;
        vatlo.form.ad_code = e.poi.adcode;
        vatlo.form.latitude = e.poi.location.lat;
        vatlo.form.address = e.poi.district + e.poi.address + e.poi.name;
      }

      // AMap.event.addListener(auto, "select", select);

      AMap.plugin("AMap.Geolocation", function () {
        var geolocation = new AMap.Geolocation({
          enableHighAccuracy: true, //是否使用高精度定位，默认:true
          timeout: 10000, //超过10秒后停止定位，默认：5s
          zoomToAccuracy: true
        });
        map.addControl(geolocation);
        if (vatlo.resId) {
          var citysearch = new AMap.CitySearch();
          citysearch.getLocalCity(function (status, result) {
            if (status === "complete" && result.info === "OK") {
              if (result && result.city && result.bounds) {
                console.log(result);
                var cityinfo = result.city;
                var citybounds = result.bounds;
                // document.getElementById('info').innerHTML = '您当前所在城市：'+cityinfo;
                vatlo.form.address = cityinfo;
                //地图显示当前城市
                map.setBounds(citybounds);
              }
            } else {
              this.$message.error(result.info);
            }
          });
        } else {
          geolocation.getCurrentPosition(function (status, result) {
            if (status == "complete") {
              onComplete(result);
            } else {
              onError(result);
            }

            //解析定位结果
            function onComplete(data) {
              console.log(data);
              vatlo.form.longitude = data.position.lng;
              vatlo.form.latitude = data.position.lat;
              vatlo.form.ad_code = data.addressComponent.adcode;
              vatlo.form.address =
                data.addressComponent.province +
                data.addressComponent.city +
                data.addressComponent.district +
                data.addressComponent.township +
                data.addressComponent.street +
                data.addressComponent.streetNumber;
            }

            //解析定位错误信息
            function onError(data) {
              this.$message.error("定位失败,原因：" + data.message);
              // this.getLngLatLocation()
            }
          });
        }
      });
    },
    //上级账号
    changePreAccount() {
      this.presuccessAccount = false;
      this.prefailureAcccount = false;
    },
    editPreAccount() {
      if (this.form.invitation_mobile.length == 0) {
        return;
      }
      this.GetshopPartnerCheck();
    },
    async GetshopPartnerCheck() {
      let res = await shopPartnerCheck({
        mobile: this.form.invitation_mobile,
        ad_code: this.form.ad_code
      });
      if (res.code === 10000) {
        if (res.data.is_adopt == 0) {
          this.prefailureAcccount = true;
        } else {
          this.presuccessAccount = true;
        }
      } else {
        this.$message.error(res.message);
      }
    },
    //获取入驻审核详情
    async getshopEnterAuditDetailData() {
      let res = await seller_detail(this.resId);
      this.form = res.data;
      if (this.form.audit_record.length > 0) {
        this.form.audit_record.map(obj => {
          // var  str = obj.split(' ')
          // console.log(str)
          //  this.activities.unshift({'content':str[0],'timestamp':str[1],'color':'#f4222d'})
          this.activities.unshift({ content: obj, color: "#f4222d" });
        });
      }
      this.loading = false;
      // if(this.form.region.province_id){
      //   this.getcommonChilderRegionList(2,this.form.region.province_id)
      //   if(this.form.region.city_id){
      //     this.getcommonChilderRegionList(3,this.form.region.city_id)
      //     if(this.form.region.area_id){
      //       this.getcommonChilderRegionList(4,this.form.region.area_id)
      //       if(this.form.region.town_id){
      //       this.getcommonChilderRegionList(5,this.form.region.town_id)
      //     }
      //     }
      //   }
      // }
    },
    //获取入驻管理详情
    async getshopEnterManagerDetailData() {
      let res = await shopEnterManagerDetailData(this.resId);
      this.form = res.data;
      let self = this;
      // if (this.form.role_type != 2) {
      //   if (this.form.vip_shop_end_time != 0) {
      //     self.form.role_type = 1;
      //   }
      // }
      this.growupForm.pay_type = res.data.vip_shop_pay_type;
      this.loading = false;
      if (this.form.invitation_mobile == "") {
        console.log(this.form.invitation_mobile);
        this.isWatchOrEdit2 = true;
      }
      // if(this.form.region.province_id){
      //   this.getcommonChilderRegionList(2,this.form.region.province_id)
      //   if(this.form.region.city_id){
      //     this.getcommonChilderRegionList(3,this.form.region.city_id)
      //     if(this.form.region.area_id){
      //       this.getcommonChilderRegionList(4,this.form.region.area_id)
      //       if(this.form.region.town_id){
      //       this.getcommonChilderRegionList(5,this.form.region.town_id)

      //     }
      //     }
      //   }
      // }
      // if(this.form.audit_record.length >0){
      //   this.form.audit_record.map(obj => {
      //     var  str = obj.split(' ')
      //      this.activities.unshift({'content':str[0],'timestamp':str[1],'color':'#f4222d'})
      //   })
      // }
    },

    //获取小店列表
    async getShopList() {
      let res = await shopTypeListAll({ keywords: "", page: 1, size: 40 });
      // this.statusList = res.data.data;
      if (res.data.data.length > 0) {
        res.data.data.map(obj => {
          this.statusList.push({ id: Number(obj.id), title: obj.title });
        });
        // this.statusList.push({'id':1,'title':'请选择'})
        this.statusList.push({ id: 0, title: "请选择" });
      }
    },
    async getShopCategoryList() {
      let res = await shopCategoryList({ keywords: "", page: 1, size: 40 });
      // this.statusList = res.data.data;
      if (res.data.data.length > 0) {
        res.data.data.map(obj => {
          this.categoryList.push({ id: Number(obj.role_id), title: obj.title });
        });
      }
    },
    lookZhifuOrder() {
      this.isorderRecord = true;
      this.shopServiceOrdersUidListData();
    },
    //获取服务费列表
    async shopServiceOrdersUidListData() {
      let res = await shopServiceOrdersUidList(this.form.uid);
      if (res.code === 10000) {
        this.orderRecData = res.data;
      } else {
        this.$message.error(res.message);
      }
    },
    //新增-小店
    addShopResceInformation() {
      if (this.audit) {
        console.log(this.form.status);
        if (Number(this.form.status) == 2) {
          this.getshopUpdateDetailData();
        } else if (Number(this.form.status) == 0) {
          if (!this.form.note) {
            this.$message.error("请填写审核意见");
            return;
          } else {
            this.getshopUpdateDetailData();
          }
        } else {
          this.$message.error("请选择审核状态");
          return;
        }
      } else {
        if (this.resId) {
          this.getshopUpdateDetailData();
        } else {
          this.getshopCreateDetailData();
        }
      }
    },

    async getshopCreateDetailData() {
      if (!this.form.vip_shop_pay_type) {
        this.$message.error("请选择缴费类型");
        return;
      }
      let res = await shopCreateDetailData(this.form);
      if (res.code === 10000) {
        this.$message.success("新增小店成功");
        if (this.type == 1) {
          this.$router.push({
            path: "./residenceaudit"
          });
        } else {
          this.$router.push({
            path: "../management/shoplist"
          });
        }
      } else {
        this.$message.error(res.message);
      }
    },
    async getshopUpdateDetailData() {
      let data = {
        id: Number(this.resId),
        status: 2,
        note: this.form.note
      }
      let url = `id=${data.id}&status=${data.status}`;
      let res = await sellerChecked(data, url);
      if (res.code === 200) {
        this.$message.success(res.message);
        if (this.type == 1) {
          this.$router.push({
            path: "./residenceaudit"
          });
        } else {
          this.$router.push({
            path: "../management/shoplist"
          });
        }
      } else {
        this.$message.error(res.message);
      }
    },
    cancelInfo() {
      if (this.type == 1) {
        this.$router.push({
          path: "./residenceaudit"
        });
      } else {
        this.$router.push({
          path: "../management/shoplist"
        });
      }
    },
    //获取省市区相关
    async getcommonChilderRegionList(type, id) {
      var url = "parent_id=" + id;
      let res = await commonChilderRegionList(url);

      if (type == 1) {
        this.provinceList = res.data;
      }
      if (type == 2) {
        this.cityList = res.data;
      }
      if (type == 3) {
        this.townAreaList = res.data;
      }
      if (type == 4) {
        this.streetList = res.data;
      } else if (type == 5) {
        this.streetAreaList = res.data;
      }
    },
    onChangeProvinceAdd(e) {
      this.form.region.city_id = this.form.region.area_id = this.form.region.town_id = this.form.region_id =
        "";
      this.getcommonChilderRegionList(2, e);
    },
    onChangeCityAdd(e) {
      this.form.region.area_id = this.form.region.town_id = this.form.region_id =
        "";
      this.getcommonChilderRegionList(3, e);
    },
    //切换区
    onChangeDownAdd(e) {
      this.form.region.town_id = this.form.region_id = "";
      this.getcommonChilderRegionList(4, e);
    },
    //切换街道
    onChangeStreet(e) {
      this.form.region_id = "";
      this.getcommonChilderRegionList(5, e);
    },
    tc() {
      return "text-align:center; color:#333333; font-size:12px;";
    },
    tccolor() {
      return "text-align:center;background-color:#f5f5f5; font-size:14px;";
    },

    //升级小店
    growUpShop() {
      this.isGrowUpShop = true;
      this.growupForm.shopId = this.resId;
    },
    //确定升级小店
    certainGrowupShop() {
      // if(!this.growupForm.pay_type){
      //   this.$message.error('请选择升级小店类型')
      //   return
      // }
      console.log(this.growupForm.pay_type);
      if (this.growupForm.pay_type != 1 && this.growupForm.pay_type != 2) {
        this.$message.error("请选择升级小店类型");
        return;
      }

      if (
        !this.growupForm.service_money ||
        Number(this.growupForm.service_money) == 0
      ) {
        this.$message.error("请填写加盟费");
        return;
      }
      this.shopUpGradeData();
    },

    async shopUpGradeData() {
      let res = await shopUpGrade(this.resId, this.growupForm);
      if (res.code === 10000) {
        this.getshopEnterManagerDetailData();
        this.$message.success(res.message);
        this.isGrowUpShop = false;
        this.growupForm = {
          pay_trade_no: "",
          pay_type: "",
          shopId: this.resId,
          service_money: ""
        };
      } else {
        this.$message.error(res.message);
      }
    },
    //续费
    pullFeeShop() {
      this.isRenewShop = true;
      this.renewForm.shopId = this.resId;
    },
    //确定续费
    certainRenew() {
      if (
        !this.renewForm.service_money ||
        Number(this.renewForm.service_money) == 0
      ) {
        this.$message.error("请填写续费金额");
        return;
      }
      this.renewVipShopWithIdData();
    },

    //续费
    async renewVipShopWithIdData() {
      let res = await renewVipShopWithId(this.resId, this.renewForm);
      if (res.code === 10000) {
        this.getshopEnterManagerDetailData();
        this.$message.success(res.message);
        this.isRenewShop = false;
        this.renewForm = {
          pay_trade_no: "",
          shopId: this.resId,
          service_money: ""
        };
      } else {
        this.$message.error(res.message);
      }
    }
  }
};
</script>
<style scoped>
.shop {
  padding: 20px;
}

.accountBtn {
  margin: 0 10px 0 12px;
}

.account_desc {
  color: blue;
  display: inline-block;
}

.account_desc_failure {
  display: inline-block;
  color: #f4222d;
}

.account_location {
  display: inline-block;
}

#container {
  width: 100%;
  height: 300px;
  margin-top: 16px;
}

.address_row {
  margin-top: 16px;
  padding: 0 20px;
}

.line {
  background-color: #e6e6e6;
  height: 1px;
  width: 100%;
}

.icon_cate {
  float: left;
}

.picCol {
  margin-top: 16px;
}

.note {
  color: #999999;
  font-size: 14px;
}

.paywayinput {
  width: 240px;
  margin-left: 12px;
}

.sub_note {
  color: #999999;
  display: inline-block;
  margin-left: 12px;
}

.text-audit {
  margin-right: 12px;
}

.footer {
  text-align: center;
  margin-top: 12px;
}

.examine {
  margin-top: 12px;
}

/* .note_back {
      margin-top: 10px;
    } */
/* .note_back {
        margin-top: 10px;
      } */
</style>
